<template>
  <div class="people_list">
    <my-header>人气推荐</my-header>
    <div class="people_count">
      <people-cart
        class="pe_ct_it"
        :objItem="item"
        v-for="(item, index) in goods"
        :key="index"
      ></people-cart>
    </div>
  </div>
</template>

<script>
import myHeader from "../../components/myHeader.vue";
import { reactive, toRefs } from "vue";
import { getGoods } from "../../api/home/home";
import peopleCart from "../../components/peopleCart.vue";
export default {
  components: { myHeader, peopleCart },
  setup() {
    const data = reactive({
      goods: [],
    });
    getGoods().then((res) => {
      data.goods = res.data;
    });
    return {
      ...toRefs(data),
    };
  },
};
</script>
<style lang="scss" scoped>
.people_list {
  height: 100%;
  background: #e9e9e9;
  overflow: hidden;
}
.people_count {
  height: calc(100% - 100px);
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  padding: 10px;
  justify-content: space-around;
  background: #fff;
  .pe_ct_it {
    width: 48%;
  }
}
</style>